<template>
  <tui-top-dropdown :translatey="translatey" :show="show" height="auto" background-color="#ffffff" @close="close">
    <view v-show="tab===0">
      <sort-model @choose="choose($event,'sort')" />
    </view>
    <view v-show="tab===1">
      <area-model @choose="choose($event,'scopeId')" />
    </view>
  </tui-top-dropdown>
</template>

<script>
import SortModel from '../sort-model/sort-model'
import AreaModel from '../area-model/area-model'
import { driverSort } from '../../index'
export default {
  name: 'DriverSort',
  components: {
    SortModel,
    AreaModel
  },
  props: {
    show: {
      type: Boolean,
      default: false
    },
    tab: {
      type: Number,
      default: 0
    },
    translatey: {
      type: Number,
      default: 0
    }
  },
  computed: {
    height() {
      if (this.tab) return 600
      else return 100 * driverSort.length
    }
  },
  methods: {
    close() {
      this.$emit('update:show', false)
      this.$emit('close')
    },
    choose(data, attr) {
      const send = {}
      send[attr] = data
      this.$emit('choose', send)
      this.close()
    }
  }
}
</script>

<style scoped>

</style>
